<template>
    <view class="appraisalList">
        
        <scroll-view scroll-y="true" class="swiper-item-box" bindscrolltolower="onReachBottom">
            <repeat for="{{list}}" key="index" index="index" item="item">
                <view class="appraisalList_list">
                    <view class='appraisalList_pd' bindtap="goDetail({{item.state}},{{item.id}})">
                        <view class='appraisalList_img'>
                            <view class='state {{item.state}}'>{{item.stateName}}</view>
                            <image src="{{item.images[0]}}"></image>
                        </view>
                        <view class='tradeName'>{{item.goodsName}}</view>
                    </view> 
                </view>
            </repeat>
            <!--加载更多时动画-->
            <bottomLoadMore :show.sync="showLoading" message="正在加载"></bottomLoadMore>
            <!--暂无数据显示-->
            <placeholder wx:if="{{is_empty}}" message="暂无消息"></placeholder>
        </scroll-view>

    </view>
</template>
<script>
    import wepy from 'wepy';
    import api from '@/api/api';
    import BottomLoadMore from "../../components/common/bottomLoadMore"
    import Placeholder from "../../components/common/placeholder"
    import {
        USER_INFO, USER_SPECICAL_INFO, SYSTEM_INFO
    } from '@/utils/constant';

    export default class appraisalList extends wepy.page {
        config = {  // 配置当前页面

            navigationBarTitleText: '鉴定列表'    // 头部标题
        };
        components = {
            bottomLoadMore: BottomLoadMore,
            placeholder: Placeholder
        };

        data = {
            list: [],
            winHeight: 0,
            //当前页面
            currentPage: 1,
            //总页数
            page_total: 0,
            //是否显示 底部loading
            showLoading: true,
            //防止重复加载
            preventRepeatReuqest: false,
            is_empty: false,
            from:''
        };

        // 获取鉴定数据列表
        async getAllIdentify(type,currentPage, size) {
            let self = this;
            let userID;
            let my_state;
            if(type === 'service'){
                userID = '';
                my_state = 'finish';
            }else{
                userID = wepy.getStorageSync('userId') || '';
                my_state = '';
            }
            const json = await api.queryIdentify({
                query:{
                    "params['userId']":userID,
                    "params['searchType']":my_state,
                    "page":currentPage || 1,
                    "limit":size || 10,
                    "sortField":'goodsName',
                    "dir":'ASC'
                }
            });
            if (json.data.code == 0) {
                let datas = json.data.data.rows;
                if(datas.length){
                    for(let one of datas){
                        one.images = one.images.split(',');
                        if(one.state){
                            switch(one.state){
                                case 'REAL':
                                one.stateName = '鉴定为真';
                                break;

                                case 'FAKE':
                                one.stateName = '鉴定为假';
                                break;

                                case 'IDENTIFY':
                                one.stateName = '鉴定中';
                                break;

                                case 'RECONSIDER':
                                one.stateName = '复议';
                                break;

                                case 'WAIT_PAY':
                                one.stateName = '待支付';
                                break;

                                default:
                                return '';
                            }
                        }
                    }
                }
                self.list = [...self.list, ...json.data.data.rows];
                self.page_total = Math.ceil(json.data.data.total / 10);
                self.$apply()
                if (json.data.page_total == 0) {
                    //暂无数据
                     self.is_empty = true;
                }
            }
            self.showLoading = false;
            self.$apply();
        }



        onLoad(option){
            let that = this;
            that.list = [];
            that.from = option.from;
            that.getAllIdentify(option.from);
        }

        //加载更多
        onReachBottom() {
            let that = this;
            that.showLoading = true;
            //判断总页数是否大于翻页数
            if ((that.page_total) > that.currentPage) {
                //防止重复加载
                if (that.preventRepeatReuqest) {
                    return true;
                }
                that.preventRepeatReuqest = true;
                that.currentPage++;
                that.getAllIdentify(that.from,that.currentPage);
                that.preventRepeatReuqest = false;
            } else {
                that.showLoading = false;
            }
        };

        methods = {  // 方法
            goDetail (a,b) {
                if(a == 'FAKE' || a == 'REAL'){
                    wepy.navigateTo({
                        url: '/pages/appraisal/detailsListFalse?id='+b+'&state='+a
                    })
                }else if(a == 'RECONSIDER'){
                    wepy.navigateTo({
                        url: '/pages/appraisal/authenticateDtl?id='+b
                    })
                }
            }
        }
        events = {};
    }

</script>
<style lang="less">
    .appraisalList{
        overflow: hidden;
        .swiper-item-box{
            height: auto;
            .appraisalList_list:nth-child(2n+1){
                margin-right: 2%;
            }
            .appraisalList_list{
                margin-top: 2%;
                background: #fff;
                width: 49%;
                float: left;
                .appraisalList_pd:nth-child(2n+1){
                     margin-right: 2%;
                 }
                .appraisalList_pd{
                    padding-top: 20rpx;
                    .state{
                        position: absolute;
                        top: 10%;
                        left: -11%;
                        font-size: 22rpx;
                        line-height: 30rpx;
                        height: 32rpx;
                        width: 50%;
                        text-align: center;
                        color: #fff;
                        transform:rotate(-45deg);
                        -webkit-transform:rotate(-45deg);
                    }
                    .state.REAL{
                        background-color: #ff0000;
                    }
                    .state.FAKE{
                        background-color: #333333;
                    }
                    .state.IDENTIFY{
                        background-color: #66cc66;
                    }
                    .state.RECONSIDER{
                        background-color: #ff9933;
                    }
                    .state.WAIT_PAY{
                        background-color: #feff7f;
                    }
                    .appraisalList_img{
                        position: relative;
                        width: 325rpx;
                        height: 325rpx;
                        margin: 0 auto;
                        image{
                            width: 100%;
                            height: 100%;
                        }
                        overflow: hidden;
                    }
                    .tradeName{
                        width: 325rpx;
                        padding: 20rpx 0;
                        margin: 0 auto;
                        overflow: hidden;
                        text-overflow:ellipsis;
                        white-space: nowrap;
                    }
                }

            }
        }
    }
</style>
